﻿<div class="bjui-pageHeader">
    <form id="pagerForm" data-toggle="ajaxsearch" action="${request.getContextPath()}/dayInOutYield/dayInOutYield" method="post">
        <div class="bjui-searchBar">
            <g:hiddenField name="SYS_QUERY_NAME" value="dayInOutYield" />
            <g:hiddenField name="EXPORT_CONTENT_NAME" value="Excel" />
            <label>扩散批号：</label>
            <input name="SUBSTRATE_ID1" value="${SUBSTRATE_ID1}" size="18"/>
            <label>组装批号：</label>
            <input name="LOT_ID" value="${LOT_ID}" size="18"/>

            <label>封装形式：</label>
            %{--<input name="RESERVED1" value="${RESERVED1}" size="18"/>--}%
            <g:select name="RESERVED1" from="${packageForm}" data-toggle="selectpicker" data-width="180" data-live-search="true" optionKey="RESERVED1" optionValue="RESERVED1" value="${RESERVED1}" noSelection="['':'--ALL--']" />&nbsp;
            <br/>
            <label>客户订单：</label>
            <input name="CUSTOMER_ORDER" value="${CUSTOMER_ORDER}" size="18"/>

            <label>工&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;步：</label>

            <g:select data-width="180" name="STEP_NAME" from="${stepList}" data-toggle="selectpicker" data-live-search="true" optionKey="STEP_NAME" optionValue="STEP_DESC" value="${STEP_NAME}" noSelection="['':'--ALL--']" />&nbsp;

            <label>日&nbsp;&nbsp;&nbsp;期<strong><span class="text-danger">*</span></strong>：</label>
            <input type="text" name="startTime" class="form-control"
                   data-toggle="datepicker" data-pattern="yyyy-MM-dd"data-rule="required;"
                   size="18" id="start-date-input" readonly value="${startTime}">&nbsp;

            <button type="submit" class="btn-default" data-icon="search">查询</button>&nbsp;
            <button type="button" class="btn-blue" onclick="javascript:bjuiExportExl('#pagerForm','${request.getContextPath()}/dayInOutYield/exportExcel')" data-icon="file-excel-o" title="导出Excel">导出Excel文件</button>&nbsp;
        </div>
    </form>
</div>
<g:if test="${dayInOutYield2.size()>0}">
<div class="bjui-pageContent">
    <div style="margin:15px auto 0; width:96%;">
        <div class="row" style="padding: 0 8px;">
            <div class="col-md-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title"><i class="fa fa-line-chart fa-fw"></i>投入产出良率图</h3>
                    </div>
                    <div class="panel-body "style="height: 500px;" width="500">
                        <div style="mini-width:400px;height:450px;" id="dayInOutYield"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div style="margin:15px auto 0; width:96%;">
        <div class="row" style="padding: 0 8px;">
            <div class="col-md-12" id="glassOutReportTable">
                <g:if test="${dayInOutYield.size()>0}">
                    <table data-toggle="tablefixed" data-width="100%" data-nowrap="true">
                        <thead>
                        <tr>
                            %{--<th rowspan="2" width="50">测试</th>--}%
                            <th width="180" align="center" rowspan="2">工步</th>
                            <th width="50" align="center" colspan="2">白班</th>
                            <th width="50" align="center" colspan="2">夜班</th>
                            <th width="50" align="center" colspan="2">总计</th>
                            <th width="50" align="center" rowspan="2">WIP</th>
                        </tr>
                        <tr>
                           %{-- <th width="50" align="center">投入数</th>--}%
                            <th width="75" align="center">产出数</th>
                            <th width="75" align="center">良率</th>

                           %{-- <th width="50" align="center">投入数</th>--}%
                            <th width="75" align="center">产出数</th>
                            <th width="75" align="center">良率</th>


                           %{-- <th width="50" align="center">投入数</th>--}%
                            <th width="75" align="center">产出数</th>
                            <th width="75" align="center">良率</th>
                        </tr>
                        </thead>
                        <tbody >
        <g:each in="${dayInOutYield2}" status="i" var="dataInstance">
                            <tr>
                                <td>${dataInstance.STEP_DESC}</td>
                            <g:each in="${dayInOutYield}" status="j" var="dataInstance1">
                                <g:if test="${dataInstance.STEP_DESC==dataInstance1.STEP_DESC}">
                               %{-- <td>--}%%{--${dataInstance1.TRACK_IN_MAIN_QTY}--}%%{--</td>--}%
                                <td  width="75" align="center">${dataInstance1.TRACK_OUT_MAIN_QTY}</td>
                              <td  width="75" align="center">${dataInstance1.YIELD}%</td>
                                </g:if>
                            </g:each>
                            <g:each in="${dayInOutYield1}" status="k" var="dataInstance2">
                                 <g:if test="${dataInstance.STEP_DESC==dataInstance2.STEP_DESC}">
                                %{--    <td>--}%%{--${dataInstance2.TRACK_IN_MAIN_QTY}--}%%{--</td>--}%
                                     <td width="75" align="center">${dataInstance2.TRACK_OUT_MAIN_QTY}</td>
                               <td width="75" align="center">${dataInstance2.YIELD}%</td>
                                 </g:if>
                            </g:each>
                                 %{--<td>--}%%{--${dataInstance.TRACK_IN_MAIN_QTY}--}%%{--</td>--}%
                                <td width="75" align="center">${dataInstance.TRACK_OUT_MAIN_QTY}</td>
                                <td width="75" align="center">${dataInstance.YIELD}%</td>
                                <g:each in="${dayInOutYield3}" status="l" var="dataInstance3">
                                    <g:if test="${dataInstance.STEP_DESC==dataInstance3.STEP_DESC}">
                                       <td>${dataInstance3.WIP_QTY}</td>
                                    </g:if>
                                </g:each>
                            </tr>
                        </g:each>
                        <g:each in="${dayInOutYield4}" status="i" var="dataInstance4">
                            <tr>
                                <th align="center" width="150">入库数量</th>
                                <td align="center" width="50" colspan="2">${dataInstance4.SHIPQTY_DAY}</td>
                                <td align="center" width="50" colspan="2">${dataInstance4.SHIPQTY_NIGHT}</td>
                                <td align="center" width="50" colspan="2">${dataInstance4.SHIPQTY_TOTAL}</td>
                                <td align="center" width="50"></td>
                            </tr>
                        </g:each>
                        </tbody>
                    </table>
                </g:if>
            </div>
        </div>
    </div>
</div>

<script src="${resource(dir: 'js/echarts', file: 'echarts.js')}" type="text/javascript"/>
<script src="${resource(dir: 'js/echarts', file: 'echarts-tool.js')}" type="text/javascript"/>



    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var contextPath = "${request.getContextPath()}";
    eChartsTool.init(contextPath);
    var data=[];
    <g:each in="${dayInOutYield2}" status="i" var="tableInstance">
    data.push('${tableInstance.STEP_DESC}');
    </g:each>
    var data1=[];
    <g:each in="${dayInOutYield2}" status="i" var="tableInstance">
    data1.push('${tableInstance.TRACK_IN_MAIN_QTY}');
    </g:each>
    var data2=[];
    <g:each in="${dayInOutYield2}" status="i" var="tableInstance">
    data2.push('${tableInstance.TRACK_OUT_MAIN_QTY}');
    </g:each>
    var data3=[];
    <g:each in="${dayInOutYield2}" status="i" var="tableInstance">
    data3.push('${tableInstance.YIELD}');
    </g:each>
    // 指定图表的配置项和数据
    var option = {
        title: {
            text: ''
        },
        tooltip: {},
        legend: {
            data:['投入','产出','良率']

        },
        grid: {
            y2:150,
            left: '3%',
            right: '4%',
            bottom: '20%',
            containLabel: true
        },
        xAxis: {
            "axisLabel":{
                "interval":0,
                "rotate":40,
                "margin":10,
            },
            data:data

        },
        yAxis:[ { axisLabel: {
            formatter: '{value} K'
        }},
            { axisLabel: {
                formatter: '{value} %'
            }}
        ],
        series: [

            { name: '投入',
                type: 'bar',
                itemStyle:{  normal:{color:'rgb(255,255,0)'}   },
                data:data1
            },
            { name: '产出',
                type: 'bar',
                itemStyle:{  normal:{color:'rgb(0,255,0)'}   },
                data:data2
            },
            { name: '良率',
                type: 'line',
                itemStyle:{  normal:{color:'rgb(255,0,0)'}   },
                yAxisIndex: 1,
                data:data3
            }
            ],
        label: {
            normal: {
                show: true,
                position: 'top'
            }
        }
    };

    // 使用刚指定的配置项和数据显示图表。
    eChartsTool.setOption("roma", document.getElementById('dayInOutYield'), option);

</script>
</g:if>